<div id="wrapper" class="f-container m-tickets" :controller="mc_tickets">
  <div class="u-titleH">
    <img src="<%= require('./images/icon_ticket.png')%>" alt=""> 订单详情
  </div>
  <div class="m-main">
    <div class="m-info">
      <div class="m-infoH">
        <span>票务信息</span>
      </div>
      <div class="m-infoM">
        <div class="infoimg">
          <img :attr="{src: @act_baseinfo.shoptemplogo + '?imageView2/1/w/160'}">
        </div>
        <div class="info">
          <div class="info-title">{{@act_baseinfo.shoptempname}}</div>
          <div class="info-date">开通费：{{@act_baseinfo.price / 100}} 元</div>
          <div class="info-address">
            <div class="address_xx">云服务费： 900元/年（首年免费）</div>
            <div class="address_dz">10万条群发短信 每月50GB流量 多媒体云存储2GB</div>
          </div>
        </div>
      </div>
    </div>
  </div>
  <div class="m-main">
    <div class="m-mainc">
      <div class="m-infoH">
        <span>联系人</span>
        <button type="button" :if="!@showContact" :click="@showContact = true">编辑</button>
      </div>
      <form class="m-contacts" :validate="@validate_contact">
        <div class="m-contactsM">
          <div class="m-contactslist">
            <label><span>*</span>姓名</label>
            <input type="text"
            :attr="{disabled: !@showContact}"
            :duplex="@contact_info.name"
            :rules="{required: true}">
          </div>
          <div class="m-contactslist">
            <label><span>*</span>手机号</label>
            <input type="text"
            :attr="{disabled: !@showContact}"
            :duplex="@contact_info.mobile"
            :rules="{required: true, pattern: /^1[3|4|5|7|8][0-9]{9}$/}"
            data-required-message="请填写手机号码"
            data-pattern-message="请填写正确的手机号码">
          </div>
          <div class="m-contactslist">
            <label><span>*</span>单位</label>
            <input type="text" :attr="{disabled: !@showContact}" :duplex="@contact_info.company"
            :rules="{required: true}">
          </div>
          <div class="m-contactslist">
            <label>职名</label>
            <input type="text" :attr="{disabled: !@showContact}" :duplex="@contact_info.title">
          </div>
        </div>
        <div class="m-button">
          <button type="submit" :if="@showContact">确认</button>
        </div>
      </form>
    </div>
  </div>

  <div class="m-main">
    <div class="m-mainp">
      <div class="m-payment">
        <div class="m-infoH">
          <span>付款</span>
        </div>
        <div class="m-paymentM" :if="!@showContact">
          <div class="m-payment-method">
            <label class="label">支付方式</label>
            <div class="m-choice">
              <label for="payment-mf" :class="['u-icon',(@payment == 1?'u-icon-select-sex':'u-icon-select-sex-default')]"></label>
              <img src="<%= require('./images/zfb.png')%>" alt="">
              <label for="payment-sf" :class="['u-icon',(@payment == 2?'u-icon-select-sex':'u-icon-select-sex-default')]"></label>
              <img src="<%= require('./images/wxzf.png')%>" alt="">
              <input id="payment-mf" type="radio" name="ticket" value="1" :duplex-number="@payment">
              <input id="payment-sf" type="radio" name="ticket" value="2" :duplex-number="@payment">
            </div>
          </div>
          <div class="m-invoice">
            <div class="invoice-l">
              <span>发票</span>
            </div>
            <div class="invoice-r">
              <div class="switch">
                <input class="mui-switch mui-switch-animbg" type="checkbox" ms-duplex-checked="@checked">
              </div>
              <form class="invoice_list" :if="@checked" :validate="@validate_invoice">
                <div class="invoice_item">
                  <label class="label">收票人类型</label>
                  <label for="invoice-mf" :class="['u-icon',(@goodsorderbill.types === 2?'u-icon-select-sex':'u-icon-select-sex-default')]"><span>公司</span></label>
                  <label for="invoice-sf" :class="['u-icon',(@goodsorderbill.types === 1?'u-icon-select-sex':'u-icon-select-sex-default')]"><span>个人</span></label>
                  <input id="invoice-mf" type="radio" name="ticket" value="2" :duplex-number="@goodsorderbill.types">
                  <input id="invoice-sf" type="radio" name="ticket" value="1" :duplex-number="@goodsorderbill.types">
                </div>
                <div class="invoice_item">
                  <label class="label">发票抬头</label>
                  <input type="text"
                  :duplex="@goodsorderbill.header"
                  :rules="{required: true}"
                  data-required-message="请填写发票抬头">
                </div>
                <div class="invoice_item">
                  <label class="label">纳税人识别号</label>
                  <input type="text" name=""
                  :duplex="@goodsorderbill.taxpayerno"
                  :rules="{required: true}"
                  data-required-message="请填写纳税人识别号">
                </div>
                <div class="invoice_item">
                  <label class="label">电子邮箱</label>
                  <input type="text" name=""
                  :duplex="@goodsorderbill.email"
                  :rules="{required: true,email: true,}"
                  data-required-message="请填写电子邮箱">
                </div>
                <div class="invoice_item">
                  <label class="label">收票方式</label>
                  <label for="way-mf" :class="['u-icon',(@goodsorderbill.receive === 1?'u-icon-select-sex':'u-icon-select-sex-default')]"><span>现场领取</span></label>
                  <label for="way-sf" :class="['u-icon',(@goodsorderbill.receive === 2?'u-icon-select-sex':'u-icon-select-sex-default')]"><span>快递</span></label>
                  <input id="way-mf" type="radio" name="ticket" value="1" :duplex-number="@goodsorderbill.receive">
                  <input id="way-sf" type="radio" name="ticket" value="2" :duplex-number="@goodsorderbill.receive">
                </div>
                <div :if="@goodsorderbill.receive === 2">
                  <div class="invoice_item">
                    <label class="label">收件人</label>
                    <input type="text" name="" :duplex="@goodsorderbill.name"
                    :rules="{required: true}"
                    data-required-message="请填写收件人">
                  </div>
                  <div class="invoice_item">
                    <label class="label">联系电话</label>
                    <input type="text" name="" :duplex="@goodsorderbill.mobile"
                    :rules="{required: true,pattern: /^1[3|4|5|7|8][0-9]{9}$/}"
                    data-required-message="请填写联系电话"
                    data-pattern-message="请填写正确的手机号码">
                  </div>
                  <div class="invoice_item">
                    <label class="label">所在地区</label>

                  </div>
                  <div class="invoice_item">
                    <label class="label">街道地址</label>
                    <input type="text" name="" :duplex="@invoice_address.street"
                    :rules="{required: true}"
                    data-required-message="请填写街道地址">
                  </div>
                  <div class="invoice_item">
                    <label class="label">邮政编码</label>
                    <input type="text" maxlength="6"
                    :duplex="@goodsorderbill.postcode"
                    :rules="{required: true, maxlength: 6, digits: true}"
                    data-required-message="请填写邮政编码"
                    data-digits-meesage="请填写正确的邮政编码">
                  </div>
                </div>

              </form>
              <div class="button">
                <button type="button" name="button" :click="@bindGopay(@payment)" target="_blank">前往付款</button>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>

</div>
